//body
body {
    background-color: #f1f1f1;
}

//header

.header {
    width: 100%;
    height: 2rem /* 100/50 */;
    background-color: #ff841d;
    border-bottom: 1px solid #ff7402;
    
    .logo {
        img {
            width: 7.5rem /* 375/50 */;
            height: 1.06rem /* 53/50 */;
        }
    }
    .he-app {
        float: right;
        margin: .28rem /* 14/50 */;
       img {
        width: 1.4rem /* 70/50 */;
        height: 1.4rem /* 70/50 */;
       }
    }
    .hea-a {
        height: 2rem /* 100/50 */;
        line-height: 2.2rem /* 110/50 */;
        i {
            font-size: .6rem /* 30/50 */;
            color: #fff;
            font-weight: 700;
            margin-left: .4rem /* 20/50 */;
            
        }
    }
}

//search
.search {
    
    width: 100%;
    height: 2rem /* 100/50 */;
    background-color: #ffffff;
    padding: .4rem /* 20/50 */;
    form {
        display: flex;
        input {
            width: 11.4rem /* 570/50 */;
            height: 1.2rem /* 60/50 */;
            border-radius: .6rem /* 30/50 */;
            background-color: #f1f1f1;
            padding-left: .4rem /* 20/50 */;
            flex: 1;
        }
        button {
            width: 2.56rem /* 128/50 */;
            height: 1.2rem /* 60/50 */;
            background-color: #ff841e;
            border-radius: .6rem /* 30/50 */;
            color: #ffffff;
            font-size: .6rem /* 30/50 */;
            margin-left: .28rem /* 14/50 */;
        }
    }
}

//nav 
.nav {
    padding: .4rem /* 20/50 */ ;
    margin: .4rem /* 20/50 */ 0 .2rem /* 10/50 */ 0 ;
    background-color: #ffffff;
    overflow: hidden;
    transition: all 1s;
    .nav-box {
        width: 25%;
        float: left;
        text-align: center;
        transition: all 1s;
        img {
            width: 2rem /* 100/50 */;
            height: 2rem /* 100/50 */;
            margin-bottom: .32rem /* 16/50 */;
            margin-top: .6rem /* 30/50 */;
        }
        
    }
   
    
}

.hide {
    transform: scale(0);
    height: 0;
}
//line
.line {
    height: 1.32rem /* 66/50 */;
    background-color: #ff9a17;
    background-image: linear-gradient(#ffaf47,#ff9a17);
    line-height: 1.32rem /* 66/50 */;
    padding: 0 .4rem /* 20/50 */;
    font-size: .68rem /* 34/50 */;
    color: #ffffff;
    p {
        float: left;
    }
    a {
        float: right;
        height: .8rem /* 40/50 */;
        width: .8rem /* 40/50 */;
        border: 1px solid #fff;
        border-radius: 50%;
        margin-top: .28rem /* 14/50 */;
        line-height: .76rem /* 38/50 */;
        text-align: center;
        font-family: '宋体';
        color: #ffffff;
        font-size: .5rem /* 25/50 */;
    }
}

//main 
.main {
    background-color: #fff;
    .main-box {
        display: flex;
        padding: .6rem /* 30/50 */ .32rem /* 16/50 */;
        border-bottom: 1px solid #c4c3c1 ;
        position: relative;
        .main-img {
            float: left;    
            width: 4.72rem /* 236/50 */;
            height: 4rem /* 200/50 */;
        
        }
        .main-p {
            float: right;
            vertical-align: middle;
            .p-top {
                min-height: 2.6rem /* 130/50 */;
                font-size: .6rem /* 30/50 */;
               
                span:nth-child(1) {
                    color: #ff5f05;
                }
            }
            .p-down {
                
                span {
                    font-size: .52rem /* 26/50 */;
                    color: #c4c3c1;
                }
                span:nth-child(1) {
                    float: left;
                }
                span:nth-child(2) {
                    float: right;
                }
            }

        }       


    }
}

//more
.more {
    padding: .4rem /* 20/50 */;
    background-color: #ffffff;
    .more-box {
        font-size: .58rem /* 29/50 */;
        color: #000000;
        background-color: #F4F4F4;
        text-align: center;
        height: 1.32rem /* 66/50 */;
        width: 14.2rem /* 710/50 */;
        line-height: 1.28rem /* 64/50 */;
        border: 1px solid #ddd;
        border-radius: .2rem /* 10/50 */;
        background-image: linear-gradient(#fff,#f4f4f4);
    }
}

//foot
.foot {
    padding-top: 1.04rem /* 52/50 */;
    background-color: #fff;
    .foot-top {
        background-color: #efefef;
        ul {
            border-color: #efefef;
            overflow: hidden;
            display: flex;
            border-top: 1px solid #c5c5c5;
            border-bottom: 1px solid #c5c5c5;
            li {
                float: left;
                width: 33.33%;
                border-right: 1px solid #c5c5c5;
                text-align: center;
                height: 1.32rem /* 66/50 */;
                a {
                    color: #000000;
                    display: block;
                    height: 100%;
                    line-height: 1.24rem /* 62/50 */;
                }
                img {
                    width:.56rem /* 28/50 */;
                    height:.56rem /* 28/50 */;
                    background-color: #efefef;
                    vertical-align: middle;
                    margin-top: -.2rem /* 10/50 */;
                }
            }
            li:nth-child(3) {
                border: none;
            }
        }
    }
    .foot-base {
        background-color: #efefef;
        height: 2.48rem /* 124/50 */;
        text-align: center;
        padding-top: .72rem /* 36/50 */;
        .red {
            color: red;
        }
        .h {
            color: #000000;
        }
    }
}